<template>
    <div class="contentbox">
        <navBar title="中药知识"/>
        <div class="knowledgedetailbox">
            <van-row><h1>{{datas.title}}</h1></van-row>
            <van-image
                width="9rem"
                height="9rem"
                fit="contain"
                :src="datas.imgurl"
                class="knowledgedetailbox_imgbox"
            />
            <van-row>
                {{datas.info}}
            </van-row>
            <br />
            <van-row>
                该词条于{{datas.date}}编辑
            </van-row>
            <van-divider />
            <van-row>
                <van-col offset="9" span="8">
                    <van-button icon="star-o" type="info">
                        收藏
                    </van-button>
                </van-col>
            </van-row>
        </div>
    </div>
</template>

<script>
import navBar from '../components/navBar.vue'

export default {
    name:'knowledgedetail',
        components:{
        navBar
    },
    data(){
        return{
            num:0,
            datas:[],
        }
    },
    methods:{
        getdata(){
            this.$axios.get("http://localhost:3000/knowledge/"+this.num)
                .then(res =>{
                    // console.log(res.data)
                this.datas=res.data
                console.log(this.datas)
            })
        },
    },
    mounted(){
        this.num=this.$route.params.id
        console.log(this.$route.params.id+1)
        this.getdata();
    },
}
</script>
<style >
    .knowledgedetailbox{
        background-color: #F2F3F5;

    }

</style>